<!--_meta 作为公共模版分离出去-->
<!DOCTYPE HTML>
<html>
<head>
<#include "head.html">
<link rel="stylesheet" type="text/css" href="${contextPath}/common/lbs.css" />
<style>
	.smallInput {
		background:#ffffff;
		border-bottom-color:#ff6633;
		border-bottom-width:0px;
		border-top-width:0px;
		border-left-width:0px;
		border-right-width:0px;
		solid #ff6633;
		color: #000000;
		FONT-SIZE: 9pt;
		FONT-STYLE: normal;
		FONT-VARIANT: normal;
		FONT-WEIGHT: normal;
		HEIGHT: 18px;
		LINE-HEIGHT: normal
	}
	
</style>
<title>添加</title>
</head>
<body>
<article class="page-container">
	<form action="${contextPath}/Hotel/save.do" method="post" class="form form-horizontal" id="form">
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">景点名称：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" required value="${entity.name}" name="name">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">城市：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="hidden" id="provinceId" value="${(entity.provinceId?c)!}">
				<input type="hidden" id="cityId" value="${(entity.cityId?c)!}">  
				<input type="hidden" id="areaId" value="${(entity.areaId?c)!}">
				<select  name="provinceId" id="province"></select>
				<select  name="cityId" id="city">
					<option value="">--请选择城市--</option>
				</select>
				<select  name="areaId" id="area">
					<option value="">--请选择区域--</option>
				</select>
			</div>
		</div>
		<div class="row cl">
			<div class="formControls col-xs-8 col-sm-12">
					<div id="tzmap" style="height:400px; margin-top:2px"></div>
					<a href="javascript:void(0);" class="inp-upload">获取经纬度</a>
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">经纬度：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" required value="${entity.gd}" id="gd" name="gd">
				<input type="text" class="input-text" required value="${entity.wd}" id="wd" name="wd">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">地址：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" required value="${entity.address}" name="address">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">区：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" required value="${entity.district}" name="district" id="district">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">联系电话：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text"  value="${entity.telephone}" name="telephone">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">级别：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="hidden" id="mlevel" value="m${entity.level}">
				<input type="hidden" name="icon" id="icon">
				<select name="level" id="level">
					<option value="5">m1</option>
					<option value="4">m2</option>
					<option value="3">m3</option>
				</select>
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">发布状态：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="hidden" id="status" value="${entity.status}">
				<select name="status">
					<option value="1">发布</option>
					<option value="0">未发布</option>
				</select>
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">景点：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="hidden" id="spot" value="${entity.spot}">
				<select name="spot">
					<option value="1">展馆展览 </option>
					<option value="2">动植物园 、公园游乐场</option>
					<option value="3">名胜古迹</option>
					<option value="4">旅游其他</option>
					<option value="5">踏青赏花</option>
					<option value="6">度假村 </option>
				</select>
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">价格：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" required value="${entity.price}" name="price">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">封面图片：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="inp" id="img" name="img" value="${entity.img}"  autocomplete="off" />
				<img src="${entity.img}" id="preview" width="550" height="300"/>
				<a href="javascript:void(0);" onclick="openBrowse(this)" class="inp-upload">上传图片</a>
				<input type="file" id="file"  name="file" onchange="uploadFile(this.type,this.id)" style="display:none"/> 
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">开放时间：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" value="${entity.description}" name="description">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">详细介绍：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<textarea cols="75" rows="8"  name="introduction" style="resize:none; border: solid 1px #ddd;">${entity.introduction}</textarea>
			</div>
		</div>
		
		
		<div class="row cl">
			<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
				<input class="btn btn-primary radius" type="submit"  value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
			</div>
		</div>
		<input type="hidden" value="${entity.id}" name="id">
	</form>
</article>

<#include "footer.html">

<!--引入高德地图API-->
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.10&key=cacc65c866a2b1c0744b73ecb9d8bce0&plugin=AMap.Transfer"></script>
<script type="text/javascript" src="${contextPath}/common/tz_map.js" ></script>
<!--请在下方写此页面业务相关的脚本--> 
<script type="text/javascript">

var contextPath="${request.contextPath}";
var basePath=$("#basePath").val();
$(function(){
    $('.skin-minimal input').iCheck({
        checkboxClass: 'icheckbox-blue',
        radioClass: 'iradio-blue',
        increaseArea: '20%'
    })

    $("#form").validate({
		rules:{
		},
		onkeyup:false,
		focusCleanup:true,
		success:"valid",
		submitHandler:function(form){
			var options = {  
					url:$("#form").attr("action"),
	                success: function() {
	                	layer.alert('操作成功', function(index){
	  	                	var index = parent.layer.getFrameIndex(window.name);
	  	        			parent.$("[name='refresh']").click();
	  	        			parent.layer.close(index);
	                	});    
	                	
	                }   
	        }; 
			$(form).ajaxSubmit(options);
		}
	});
    
   
    $("input[name='level']").each(function(){
    	var level=$("#mlevel").val();
		if($(this).text()==level){
			$(this).attr("selected",true);
		}
		
		$("#level").find(level).attr("selected","selected");
   });
    
    
    $("input[name='spot']").each(function(){
    	var spot=$("#spot").val();
		if($(this).val()==spot){
			$(this).attr("selected",true);
		}
   });
    
    $("input[name='status']").each(function(){
    	var status=$("#status").val();
		if($(this).val()==status){
			$(this).attr("selected",true);
		}
   });
    
    
    var gd=$("#gd").val();
    var wd=$("#wd").val();
    if(isNotEmpty(gd)){
    	 tzShop.initMap(gd,wd);
    }else{
    	tzShop.initMap("116.397428", "39.90923");
    }
    
    
    
});



var tzShop = {
		initMap:function(gd,wd){
			var map = new AMap.Map("tzmap", {
			    resizeEnable: true,
			                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 
			    zoom:11,
			    center: [gd, wd]
			});	
			var level= $("#level").val();
			var icon_val= $("#level").text();
			$("#icon").val(icon_val);
			level="m"+level;
			tzShop.marker(map,gd,wd,level);
			
			map.on('click', function(e) {
				map.clearMap();
				$(".micon").remove();
				var level= $("#level").val();
				var icon_val= $("#level").text();
				$("#icon").val(icon_val);
				level="m"+level;
				tzShop.marker(map,e.lnglat.getLng(),e.lnglat.getLat(),level);
				$("#gd").val(e.lnglat.getLng());
				$("#wd").val(e.lnglat.getLat());
			});
			
			
			setTimeout(function province(){
				var provinceId=$("#provinceId").val();
				var cityId=$("#cityId").val();
				if(isNotEmpty(provinceId)){
					$("#province").val(provinceId);
					$("#province").attr("selected",true);
					changeCity(provinceId);
					changeArea(cityId);
					map.setCity($("#province").find("option:selected").text());
				}
			}, 1000);
			
			setTimeout(function selected(){
				var cityId=$("#cityId").val();
				var areaId=$("#areaId").val();
				$("#city").val(cityId);
				$("#city").attr("selected",true);
				$("#area").val(areaId);
				$("#area").attr("selected",true);
				map.setCity($("#city").find("option:selected").text());
			}, 2000);
			
			
			$("#province").change(function(){
				map.setCity($(this).find("option:selected").text());
			});
			
			$("#city").change(function(){
				map.setCity($(this).find("option:selected").text());
			});
			
			$("#area").change(function(){
				var district=$(this).find("option:selected").text();
				map.setCity(district);
				$("#district").val(district);
			});
			
		},
		marker:function(map,gd,wd,icon){
			var thisMap = map;
			 new AMap.Marker({ //添加自定义点标记
				map: thisMap,
				position: [gd, wd], //基点位置
				offset: new AMap.Pixel(-17, -52), //相对于基点的偏移位置
				draggable: false,  //是否可拖动
				content: '<span class="mp micon '+icon+'"></span>'   //自定义点标记覆盖物内容
			});
		}
		
	};


/*点击按钮的时候--伪装文件上传*/
function openBrowse(obj){ 
	//判断浏览器的兼容性问题
	var ie=navigator.appName=="Microsoft Internet Explorer" ? true : false; 
	if(ie){ //如果是ie浏览器
		document.getElementById("file").click(); 
		document.getElementById("filename").value=document.getElementById("file").value;
	}else{
		var a=document.createEvent("MouseEvents");//FF的处理 
		a.initEvent("click", true, true);  
		document.getElementById("file").dispatchEvent(a); 
	} 
} 

function uploadFile(type,id) {
	var formData = new FormData();
    formData.append(type, $("#"+id)[0].files[0]);    //生成一对表单属性
    $.ajax({
        type: "POST",           //因为是传输文件，所以必须是post
        url: '${contextPath}/Hotel/upload.do',         //对应的后台处理类的地址
        data: formData,
        processData: false,
        contentType: false,
        success: function (data) {
        	if(data!="error"){
        		$("#img").val(data);
				$("#preview").attr("src",data);
        	}
        }
    });
};

function changeCity(pid){
	if(pid==""){
		return;
	}
	$("#area").html("<option value=''>--请选择区域--</option>");
	$.get(contextPath+"/common/pca/city.json",function(data){
		getHTML("city",data[pid],"城市");
	});
};



function changeArea(cid){
	if(cid==""){
		return;
	}
	$("#area").html("<option value=''>--请选择区域--</option>");
	$.get(contextPath+"/common/pca/area.json",function(data){
		getHTML("area",data[cid],"区域");
	});
};



function getHTML(id,data,message){
	var html = "<option value='''>--请选择"+message+"--</option>";
	for(var i=0,len=data.length;i<len;i++){
		html+="<option value='"+data[i].id+"'>"+data[i].name+"</option>";
	}
	$("#"+id).html(html);
};

</script> 
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>